
<style>
#add,#remove_field{
	background-color: #d3d3d3;
	width: 20px;
	height: 20px;
	display: inline-block;
	text-align: center;
	color: #0033ff;
	font-size: 19px;
	cursor: pointer;
    margin-right: 20px;
}

.input_holder input{
	display:block;
}
.input_holder2 input{
	display:block;
}
.input_holder{
		float:left;
		width: 600px;
        padding:5px;
		
}
.css_add_remove{
    float:left;
    width:500px;
    margin-left: 442px;
    
}
select{
    height:25px;
}

</style>

	
	<script type="text/javascript">
	$().ready(function(){	   
	$('#add').click(function(){
    var input = $('#input_clone');
            var clone = input.clone(true);
			clone.removeAttr ('id');
			clone.val('');
			clone.appendTo('.input_holder');
            /* */
             
            
             var name = $('#name_file');
			var clone2 = name.clone(true);
			clone2.removeAttr ('id');
			clone2.val('');
			clone2.appendTo('.input_holder');
            var order = $('#txt_order');
			var clone3 = order.clone(true);
			clone3.removeAttr ('id');
			clone3.val('');
			clone3.appendTo('.input_holder');
            var active = $('#txt_active');
			var clone4 = active.clone(true);
			clone4.removeAttr ('id');
			clone4.val();
			clone4.appendTo('.input_holder'); 
			var select = $('#txt_select');
			var clone5 = select.clone(true);
			clone5.removeAttr ('id');
			clone5.val('');
			clone5.appendTo('.input_holder');
		});
    $('#remove_field').click(function(){
		
        
			if($('.input_holder select:last-child').attr('id') != 'txt_select'){
				$('.input_holder select:last-child').remove();
			}
           if($('.input_holder input:last-child').attr('id') != 'name_file'){
				$('.input_holder input:last-child').remove();
			}
            if($('.input_holder input:last-child').attr('id') != 'input_clone'){
				$('.input_holder input:last-child').remove();
			}
            if($('.input_holder input:last-child').attr('id') != 'txt_order'){
				$('.input_holder input:last-child').remove();
			}
            if($('.input_holder input:last-child').attr('id') != 'txt_active'){
				$('.input_holder input:last-child').remove();
			}
            
			
             
            
           
            
		});
	
	});
	
	</script>
</head>
<div class="info">
<h1 class="font_h1">Tạo mới Albums</h1>
<?php if(isset($error))  : ?>
<h2 class="error_red"><?php echo $error;?></h2>
<?php endif;?>
<div class="css_add_remove">
    <span id="add">+</span><span id="remove_field">-</span>
</div>


<p style="clear:both;"></p>
<form id="frm_add" action="<?php echo base_url().'admin/photo/add_update_photo'?>" method="POST" enctype="multipart/form-data">
	<div class="input_holder">
		<input type="text" name="name_files[]" id="name_file" style="float:left;width:100px; height:20px" />
        <input type="text" name="txt_order[]" id="txt_order" style="float:left;width:50px; height:20px; margin: 0px 5px;" />
        <input type="checkbox" name="txt_active[]" value="1" id="txt_active" style="float:left;width:10px; height:20px; margin: 0px 5px;" />				
		<select id="txt_select" name="txt_select[]" style="float: left; width:100px; margin:0px 5px;">
            <?php foreach($cats as $row) :?>
            <option value="<?php echo $row->id_album_cats?>"><?php echo $row->title_cats?></option>
            <?php endforeach; ?>
        </select>
        <input type="file" name="uploaded_files[]" id="input_clone" style="float:right;width:290px"/>
		<p style="clear:both;"></p>
	</div>
	<p style="clear:both;"></p>
   <table class="table1"> 
   <tr>
                <td width="20%"></td>
                <td width="80%">
                <a  class="button" onclick="$('#frm_add').submit()" href="javascript:void(0)">Lưu lại</a>
                 <a  class="button" href="<?php echo base_url().'admin/photo/list_photo'?>">Quay lại</a>
                </td>
    </tr>
</table>
	
	

</form>
<p style="clear:both;"></p>
</div>
